
import React, { PureComponent } from 'react'
import {Modal,Form, Input,Select} from 'antd'
import PropTypes from 'prop-types'


const Item = Form.Item
const { Option } = Select
 class  AdduserForm extends PureComponent {
     static propTypes={ 
        setForm: PropTypes.func.isRequired,
     }

     UNSAFE_componentWillMount() { 
         this.props.setForm(this.props.form)
         }

    render() {
        const { getFieldDecorator} = this.props.form
        const {roles,user} = this.props
        const {username,password,phone,email,role_id} = user
     
    const formItemLayout = {
        labelCol: { span: 6 },
        wrapperCol: { span:16 },
      };
        
        return (
    <div>
    
        <Form {...formItemLayout}>
       
         <Item label="用户名">
             {
                 getFieldDecorator('username',{
                     initialValue:username 
                 })(<Input placeholder='请输入用户名'/>)
             }
         </Item>
         <Item label="密码">
             {
                 getFieldDecorator('password',{
                     initialValue: password
                 })(<Input placeholder='请输入密码'  disabled={password}/>)
             }
         </Item>
         <Item label="手机号">
             {
                 getFieldDecorator('phone',{
                     initialValue: phone
                 })(<Input placeholder='请输入手机号码'/>)
             }
         </Item>
         <Item label="邮箱">
             {
                 getFieldDecorator('email',{
                     initialValue: email 
                 })(<Input placeholder='请输入邮箱'/>)
             }
         </Item>
         
         <Item label="角色">
             {
                 getFieldDecorator('role_id',{
                     initialValue: role_id 
                 })(
                     <Select
                    placeholder="请选择角色名"
                     
                     >
                         {/* <Option key='1'>a</Option> */}
                         {roles.map((item,index)=>(
                             <Option key={index} value={item._id}>{item.name}</Option>
                         ))}
                     </Select>
                 )
             }
         </Item>
         </Form>
       
    </div>
        )
    }
}

export default  Form.create()( AdduserForm)

